<template>
  <div class='searchForm'>
    <div class='item'>
      <span class='label'>全覆盖任务：</span>
      <a-select
        show-search
        :allowClear='false'
        placeholder='请选择届次'
        v-model='searchForm.Peiod'
        :disabled="isEdit"
        @change="changePeiod"
        style="color: #000"
      >
        <a-select-option
          v-for='(item, key) in Peiods'
          :key='key'
          :value='item.value'

        >
          {{ item.label }}
        </a-select-option>
      </a-select>
    </div>
    <div class='item ml36'>
      <span class='label'>轮次：</span>
      <a-select
        :default-value="l_sel"
        show-search
        :allowClear='false'
        placeholder='请选择轮次'
        v-model='searchForm.Wheel'
        :disabled="isEdit"
        @change="changeWheels"
        style="color: #000"
      >
        <a-select-option
          v-for='(item, key) in Wheels'
          :key='key'
          :value='item.value'

        >
          <span>{{ item.label }}</span>
        </a-select-option>
      </a-select>
    </div>


  </div>
</template>
<script>
import { getJLSelected, getUnitsinfos, setJLSelected } from '@/utils/fileUtils';
import eventBus from '@/utils/event';

export default {
  name: 'PeiodWheelGroup',
  props: {
    value: Object,
    path: String,
  },
  data() {
    return {
      isEdit: false,
      Peiods: [],//届
      Wheels: [],//轮
      searchForm: {
        Peiod: undefined,
        Wheel: undefined,
      },
      j_sel: {},
      l_sel: {},
    };
  },
  created() {
  },
  mounted() {
    this.getMsg()
    eventBus.addListener('updatewhel', this.getMsg);
  },
  methods: {
    changePeiod(e) {
      console.log('pid-1-', e);
      setJLSelected(e, '');
      this.j_sel.value = e;
      //更新论数据
      const sllist = getUnitsinfos();
      this.Wheels = [];
      sllist.forEach(item => {
        if (item.sessionId == e) {
          const w = {};
          w.value = item.roundId + '' + item.unitId;
          w.label = item.roundName;
          //this.searchForm.Wheel=item.roundName
          this.Wheels.push(w);
        }
      });
    },
    changeWheels(e) {
      console.log('pid-2-', this.j_sel.value+e);
      this.l_sel.value = e;
      setJLSelected(this.j_sel.value+e);
      // const sllist = getUnitsinfos();
      // sllist.forEach(item => {
      //   if (item.roundId == e) {
      //     //this.searchForm.Peiod=item.sessionName
      //   }
      // });
    },
    getUnits() {
      const sllist = getUnitsinfos();
      console.log('wel-1--', sllist.length);
      sllist.forEach(item => {
        const w = {};
        w.value = item.roundId + '' + item.unitId;
        w.label = item.roundName;
        this.Wheels.push(w);

        const p = {};
        p.value = item.sessionId;
        p.label = item.sessionName;
        this.Peiods.push(p);
        console.log('wel---', item);

      });
    },
    getJLSelecteds() {
      let sllist = getJLSelected();
      if (sllist.length > 0) {
        this.j_sel.value = sllist[0].sessionId;
        this.j_sel.label = sllist[0].sessionName;
        this.l_sel.value = sllist[0].roundId + '' + sllist[0].unitId;
        this.l_sel.label = sllist[0].roundName;
        this.searchForm.Peiod = sllist[0].sessionName;
        this.searchForm.Wheel = sllist[0].roundName;
      }
    },
    getMsg() {
      console.log('update--');
      this.Wheels=[]
      this.Peiods=[]
      this.getJLSelecteds()
      this.getUnits()
    },
  },
  watch: {
    $route: {
      handler(to) {
        console.log('vaks', to);
        if (to.path === '/home') {
          this.isEdit = false;
        } else {
          this.isEdit = true;
        }
      },
      deep: true,
    },
    searchForm: {
      handler(val) {
        console.log('vak', val);
        this.$emit('input', val);
      },
      deep: true,
    },
  },
};
</script>

<style lang='less' scoped>
.searchForm {
  margin-bottom: 8px;
  height: 76px;
  line-height: 76px;
  text-align: left;
  padding-left: 36px;
  background-color: #ffffff;
  box-shadow: 0px 2px 8px 0px rgba(58, 109, 189, 0.3);
  border-radius: 4px;

  .item {
    display: inline-block;
  }

  .ml36 {
    margin-left: 36px;
  }

  .label {
    height: 28px;
    font-family: PingFangSC-Medium;
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    line-height: 28px;
    letter-spacing: 0px;
    color: #333333;
  }

  .text {
    display: inline-block;
    width: 260px
  }

  /deep/ .ant-select {
    width: 260px;
    height: 38px;
    margin-right: 8px;
    margin-bottom: 6px;
    font-size: 18px;

    .ant-select-selection--single {

      height: 38px;
    }

    .ant-select-selection__placeholder {
      height: 38px;
      line-height: 38px;
      top: 9px;
    }

    .ant-input-number-input {
      height: 38px;
      line-height: 38px;
    }
  }

  .ant-select-selection__clear {
    font-size: 18px;
    top: 41%;
  }

  .ant-select-selection--multiple {
    height: 38px;
    padding: 0;
    overflow: auto;
  }

  .ant-select-selection__rendered {
    line-height: 36px;
    margin-bottom: 0;
    top: -1px;
  }

}

</style>
